import React from 'react';
import style from "./Star.module.scss";
import QuestionCard from "../../components/QuestionCard";
import {Empty, Spin, Typography} from "antd";
import ListSearch from "../../components/ListSearch";
import useLoadQuestionListData from "../../hooks/useLoadQuestionListData";
import ListPage from "../../components/ListPage";


const {Title} = Typography
const Star: React.FC = () => {
    const {data = {}, loading = false} = useLoadQuestionListData({isStar: true})
    const {total = 0, list = []} = data
    return (
        <div>
            <div className={style.header}>
                <div className={style.left}>
                    <Title level={3}>我的问卷</Title>
                </div>
                <div className={style.right}>
                    <ListSearch/>
                </div>
            </div>
            <div className={style.content}>
                {
                    loading ? <div style={{textAlign: 'center'}}>
                        <Spin/>
                    </div> : ''
                }
                {!loading && list.length === 0 && <Empty description={'暂无数据'}/>}
                {
                    list.length > 0 && list.map((item: any) => {
                        const {_id} = item
                        return <QuestionCard key={_id} {...item}/>
                    })
                }
            </div>
            <div className={style.footer}>
                <ListPage total={total}/>
            </div>
        </div>
    );
};

export default Star;
